<template>
    <div class="pay-contianer">
        <div class="pay-input">
            <van-field v-model="value" placeholder="请输入收银金额" readonly="false" />
        </div>
        <div class="pay-limit">
          <span>收银金额必须大于{{limitVal}}元</span>
        </div>
        <div>
            <keyborad @setInputVal= "setInputVal" :inputVal="value" :confirmPay="confirmPay" :limitVal="limitVal" ></keyborad>
        </div>
    </div>    
</template>
<script>
import keyborad from "base/keyBoard/keyBoard";
export default {
  data() {
    return {
      value: "",
      show: true,
      limitVal:5 // 最低付款金额
    };
  },
  methods: {
    setInputVal(val) {
      this.value = val
    },
    confirmPay(callback) {
      let that = this
      that.$storage.set("amount",that.value)
      that.$router.push({
          path:'/ChoseCard'
      })
    }
  },
  components: {
    keyborad
  }
};
</script>
<style lang="less" scoped>
.pay-contianer {
  width: 100%;
  height: 100vh;
  background-color: #f5f5f5;
  .pay-input {
    padding-top: 7%;
    height: 17vw;
    line-height: 17vw;
    .van-cell {
      width: 100%;
      font-size: 5vw;
      line-height: 16vw;
      padding: 0 0 0 5%;
      text-indent: 6%;
    }
  }
  .pay-limit {
    padding: 1% 0 0 3.5%;
    color: #c8c8c8;
    font-size: 4vw;
  }
}
</style>
